import './static/reset-element.scss';
import { ref } from 'vue';
import { ElButton } from 'element-plus';
import ZwUnityKitSelectFriendMaterial from '../../src/ZwUnityKitSelectFriendMaterial/Index.vue';

window.domainApi = '//api-dev.scrm.keyid.cn';

export default {
    title: 'Scrm System/ZwUnityKitSelectFriendMaterial Library/ZwUnityKitSelectFriendMaterial',
    component: ZwUnityKitSelectFriendMaterial,
    tags: ['autodocs'],
    argTypes: {
        modelValue: {
            control: { type: 'boolean' },
            type: { name: 'boolean', required: false },
            description: '是否显示组件， 默认为false'
        },
        radioData: {
            control: { type: 'object' },
            type: { name: 'object', required: false },
            description: '用于回显选中的数据'
        }
    }
};

const Template = args => ({
    components: { ZwUnityKitSelectFriendMaterial, ElButton },
    setup() {
        const open = () => {
            args.modelValue = true;
        };
        const submit = val => {
            // console.log('val -   ', val);
        };
        const close = () => {
            // console.log('close -   ');
        };
        return {
            args,
            open,
            submit,
            close
        };
    },
    template: `
        <ElButton @click="open">选择朋友圈素材</ElButton>
        <ZwUnityKitSelectFriendMaterial v-bind="args" v-model="args.modelValue" @submit="submit" @close="close" />
    `
});

/**
 *  默认演示
 */
export const Default = Template.bind({});

/**
 *  数据回显
 */
export const DefaultSelected = Template.bind({});
DefaultSelected.args = {
    radioData: { id: 205 }
};
